<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib uri="http://www.ecside.org" prefix="ec"%>
<jsp:useBean id="pageBean" scope="request" class="com.agileai.hotweb.domain.PageBean"/>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" href="flow/lib/jquery-ui-1.8.4.custom/css/smoothness/jquery-ui-1.8.4.custom.css" rel="stylesheet" />
<script type="text/javascript" src="flow/lib/raphael-min.js"></script>
<script type="text/javascript" src="flow/lib/jquery-ui-1.8.4.custom/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="flow/lib/jquery-ui-1.8.4.custom/js/jquery-ui-1.8.4.custom.min.js"></script>
<script type="text/javascript" src="js/util.js"></script>
<script type="text/javascript" src="flow/myflow.js"></script>
<script type="text/javascript" src="flow/myflow.jpdl3.js"></script>
<script type="text/javascript" src="flow/myflow.editors.js"></script>
<script src="js/ArrayList.js" type="text/javascript"></script>
<script src="js/Map.js" type="text/javascript"></script>
<script src="js/PopupBox.js" language="javascript"></script>
<script type="text/javascript">
$(function() {
	var url = "<%=pageBean.getHandlerURL()%>&actionType=retrieveJsonData&WFP_ID=<%=pageBean.inputValue("WFP_ID")%>&WFIP_ID=<%=pageBean.inputValue("WFIP_ID")%>";
	sendRequest(url,{onComplete:function(responseText){
		var jsonData = $.parseJSON(responseText);
		var restoreJson = jsonData.restore;
		var activeRectsJson = jsonData.activeRects; 
		$('#myflow').myflow(
				$.extend(true,{
					basePath : "",
					restore : restoreJson,
					editable : false
				},activeRectsJson)
			)
	}});
});

</script>
<style type="text/css">
body {
	margin: 0;
	pading: 0;
	text-align: left;
	font-family: Arial, sans-serif, Helvetica, Tahoma;
	font-size: 12px;
	line-height: 1.5;
	color: black;
	background-image: url(flow/img/bg.png);
}
.node {
	width: 70px;
	text-align: center;
	vertical-align: middle;
	border: 1px solid #fff;
    height: 23px;
    line-height: 23px;	
}
.node img{
	vertical-align:middle;
}

.mover {
	border: 1px solid #ddd;
	background-color: #ddd;
}

.selected {
	background-color: #ddd;
}

.state {
	
}

#pointer {
	background-repeat: no-repeat;
	background-position: center;
}

#path {
	background-repeat: no-repeat;
	background-position: center;
}

#task {
	background-repeat: no-repeat;
	background-position: center;
}

#state {
	background-repeat: no-repeat;
	background-position: center;
}
</style>
</head>
<body>
<form action="<%=pageBean.getHandlerURL()%>" name="form1" id="form1" method="post">
	<div id="myflow"></div>
	<input type="hidden" name="actionType" id="actionType" value=""/>
	<input type="hidden" name="tempJson" id="tempJson" value=""/>
	<input type="hidden" name="processJson" id="processJson" value=""/>
	<input type="hidden" name="evtObjec" id="evtObjec" value=""/>
	<input type="hidden" id="WFP_ID" name="WFP_ID" value="<%=pageBean.inputValue("WFP_ID")%>" />
	<input type="hidden" id="WFIP_ID" name="WFIP_ID" value="<%=pageBean.inputValue("WFIP_ID")%>" />	
</form>
</body>
</html>